// import * as ymaps3 from "ymaps3";

document.addEventListener("DOMContentLoaded", function () {
  const validation = new JustValidate(".contacts__form", {
    // colorWrong: "#d11616",
    validateBeforeSubmitting: true,
    errorLabelStyle: {
      color: "#d11616",
    },
  });
  const selector = document.querySelector("input[type='tel']");
  const im = new Inputmask("+7 (999)-999-99-99");
  im.mask(selector);

  validation
    .addField(".contacts__input--name", [
      {
        rule: "required",
        errorMessage: "Вы не ввели имя",
      },
      {
        rule: "minLength",
        value: 3,
        errorMessage: "Не достаточное количество символов",
      },
      {
        rule: "maxLength",
        value: 30,
        errorMessage: "Максимальное кол-во символов: 30",
      },
    ])

    .addField(".contacts__input--tel", [
      {
        rule: "required",
        errorMessage: "Вы не ввели телефон",
      },
      {
        rule: "function",
        validator: function (name, value) {
          const phone = selector.inputmask.unmaskedvalue();
          return Number(phone) && phone.length === 10;
        },
        errorMessage: "Необходимо ввести 10 цифр",
      },
    ]);
});
